<style lang="less">
// 占位div样式
.left-div {
  visibility: hidden;
  border-style: solid;
  border-color: black;
  /* border-right-color: red; */
  border-color: transparent;
}
// 内容部分
.content-wrapper {
  margin: 0px 10px 0px 0px;
  overflow: hidden;
}

// 侧边栏
.right-aside {
  // width: 300px;
  position: fixed;
}

body {
  overflow: scroll;
}
</style>
<template>
  <div class="ora-web-index">
    <Row>
      <Col span="1" class="left-div"></Col>
      <Col span="22">
        <Row>
          <!-- 左边侧边栏 -->
          <Col span="4">
            <div class="right-aside">
              <!-- <Col span="8"> -->
              <Menu>
                <MenuItem name="1">
                  <Icon type="ios-paper"/>
                  <router-link  :to="{name:'user-center'}">用户主页</router-link>
                </MenuItem>
                <MenuItem name="2">
                  <Icon type="ios-people"/>
                  <router-link :to="{name:'user-info'}">用户信息</router-link>
                </MenuItem>
              </Menu>
              <!-- </Col> -->
            </div>
          </Col>
          <Col span="19" style="margin-left: 250px;">
            <div class="content-wrapper">
                <router-view></router-view>
            </div>
          </Col>
        </Row>
      </Col>
      <Col span="1"></Col>
    </Row>
  </div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'

export default {
  components: {},
  data () {
    return {}
  },
  methods: {
    ...mapActions(['handleLogin', 'getUserInfo']),

    // 页面初始化方法
    init () {
      this.query()
      this.getProfessionCourseData()
    }
  },
  computed: {
    ...mapGetters(['isLogin', 'getUserId', 'getUserName'])
  },
  watch: {},
  mounted () {
    this.init()
  }
}
</script>
